<template>
	<view class="_pad-x-10 _pad-top-10 _pad-bottom-40" style="background-color: #f8f8f9;height: 100vh;">
		<navigator :url="`/pages/car_sub/relet_info/detail?id=${item.id}`" v-if="list.length > 0" hover-class="none" class="_w-max _white-bg _pad-15 _mar-bottom-10" style="border-radius: 20rpx;" v-for="(item,index) in list" :key="index">
			<view class="_flex-row-bet-mid _mar-bottom-15">
				<view class="_font-16 _b">续租至：{{ item.end_time }}</view>
				<view v-if="item.rerent_status == -1" class="_font-14 red-color">已取消({{ item.pay_time > 0 ? '已支付' : '未支付'}})</view>
				<view v-if="item.rerent_status == 0" class="_font-14 red-color">未支付({{ item.pay_time > 0 ? '已支付' : '未支付'}})</view>
				<view v-if="item.rerent_status == 10" class="_font-14 green-color">申请中({{ item.pay_time > 0 ? '已支付' : '未支付'}})</view>
				<view v-if="item.rerent_status == 20" class="_font-14 green-color">已同意({{ item.pay_time > 0 ? '已支付' : '未支付'}})</view>
				<view v-if="item.rerent_status == 30" class="_font-14 red-color">已拒绝({{ item.pay_time > 0 ? '已支付' : '未支付'}})</view>
			</view>
			<view class="_flex-row-bet-mid _font-13">
				<view class="_grey-99">订单创建时间</view> <view>{{ item.add_time }}</view>
			</view>
		</navigator>
		<view class="_w-max _flex-col-mid" style="margin-top: 321rpx;" v-if="list.length === 0">
			<image style="width: 272rpx;height: 272rpx;" src="https://taxi.raxan.xyz/wechat/static/images/car/no-data.png" mode="widthFix"></image>
			<view class="_mar-top-10" style="color: #999;font-size: 32rpx;">暂无订单</view>
		</view>
	</view>
</template>

<script>
	import { getRerentList } from '@/api/car.js';
	export default{
		data(){
			return{
				thisForm:{
					page:1,
					limit:15,
					order_id: 0,
				},
				list:[],
				order_id:0,
			}
		},
		onLoad(option){
			this.order_id = option.order_id;
			this.thisForm.order_id = this.order_id;
		},
		onShow() {
			uni.showLoading({title:'正在加载',mask:true});
			this.list = [];
			this.thisForm.page = 1;
			this.getList();
		},
		onReachBottom(){
			uni.showLoading({title:'正在加载',mask:true});
			this.getList();
		},
		methods:{
			getList(){
				let that = this;
				let list = [];
				getRerentList(that.thisForm).then((res)=>{
					list = res.data.list;
					if(list.length>0){
						that.thisForm.page++;
						that.list = that.list.concat(list);
					}
					uni.hideLoading();
				}).catch((err)=>{
					uni.hideLoading();
					uni.showToast({ title:err.msg, icon:'none' });
				})
			},
		},
	}
</script>

<style scoped lang='scss'>
	.red-color{
		color: #F52828;
		}
	.green-color{
		color: #28B128;
	}
</style>